<template>
	<div class="back_contain_n">
		<!-- 头部搜索 -->
		<div class="Search_Top_Part">
			<div class="search_list">
				<div>


					<div class="input_flex daterange select">
						<el-select v-model="year" placeholder="" >
							<el-option v-for="item in yearsList" :key="item" :label="item" :value="item"></el-option>
						</el-select>
					</div>
					<div class="input_flex daterange select">
						<el-select v-model="month" placeholder="" >
							<el-option v-for="item in monthsList" :key="item" :label="item" :value="item"></el-option>
						</el-select>
					</div>
				</div>
			</div>
			<div class="search_bt">
				<span class="zll-search" @click="getList">搜索</span>
			</div>
		</div>
		<!-- table -->
		<sys-table class="m_table" ref="systable" :isMultipleSelection="false" :tableData="tableData"
			:tableLoading="tableLoading" :tableHeader="tableHeader" :scopeWidth="120" :backCount="backCount"
			@getBackData="getList" :isOperate="false" :isPagination="false">

		</sys-table>

	</div>
</template>

<script>
	import { formatDate } from "@/plugins/formatDate";
	export default {
		data() {
			return {
				tableLoading: true, //table刷新
				backCount: 0,
				tableData: [],
				tableHeader: [],
				yearsList: [],
				monthsList: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
				year: (new Date().getFullYear()) + '年',
				month: (new Date().getMonth() + 1) + '月',

			};
		},

		methods: {
			getRecentYears(count) {
				const current = new Date().getFullYear();
				return Array.from({ length: count }, (_, i) => (current - (count - 1) + i) + '年');
			},

			getList() {
				let self = this;
				let param = {};
				param.startTime =  this.year.split("年").join("-") + this.month.split("月").join("")
				// param.endTime = this.year.split("年").join("-") + this.month.split("月").join("") + ' 23:59:59'


				self.$http({
					url: "/jinl/plan/getPlanAnalysisList",
					method: "post",
					data: JSON.stringify(param),
					dataType: 'json',
					contentType: "application/json",
				}).then(resp => {
					if (resp.success) {
						self.tableLoading = false;
						self.tableData = [resp.result];
						self.tableHeader = [
							{ "columnValue": "orderTotalPlan", "columnName": "订单计划（万支）累加值" },
							{ "columnValue": "orderTotalComplete", "columnName": "订单已完成（万支）累加值" },
							{ "columnValue": "orderCompletionRate", "columnName": "生产完成计划率" },
							{ "columnValue": "stockTotalPlan", "columnName": "备货计划（万支）累加值" },
							{ "columnValue": "stockTotalComplete", "columnName": "备货已完成（万支）累加值" },
							{ "columnValue": "stockCompletionRate", "columnName": "备货完成计划率" },
						];
						if (resp.result.length > 0) {
							self.backCount = resp.result[0].count;
						} else {
							self.backCount = 0;
						}
					}
				});
			},


		},
		created() {
			this.yearsList = this.getRecentYears(3);
		},
		mounted() {
			this.getList();
		},


	};
</script>

<style lang="scss" scoped>
	@import "@/style/SearchTop.scss";
	.select {
		::v-deep .el-input--suffix .el-input__inner {
			text-align: center;
		}
	}
</style>